<template>
	<view class="listsp">
		<view class="listitem flex-row-between" 
		     @click="jump(url,item.id)"
			v-for="(item,index) in list" :key='index'>
			<image :src="item.bannerImages" class="bg" mode="aspectFill"></image>
			<view class="info">
				<view class="title font16 flex-row-start">
					<view class="bold">{{item.courseName}}</view>
					<view class="tip font12" v-if='needtip !=="no"'>可预约</view>
				</view>
				<view class="jieshao font12 color9">
					{{item.remark}}
				</view>
				<view class="price yellow">￥0</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:['bg','title','price','url','needtip','list'],
		methods:{
			jump(res,id){
				uni.navigateTo({
					url: res+'?id='+id
				});
			}
		}
	}
</script>

<style scoped lang="scss">
	.listitem{
		border-radius: 12px;
		overflow: hidden;
		height: 130px;
		margin-bottom: 10px;
		overflow: hidden;
		background-color: #fff;
		.bg{
			width: 40%;
			height: 130px;
		}
		.info{
			width: 58%;
			padding:0 12px;
			.jieshao{
				height: 44px;
				line-height: 22px;
				display: -webkit-box;
			    -webkit-line-clamp: 2;
			    -webkit-box-orient: vertical;
			    overflow: hidden;
			    text-overflow: ellipsis;
			    white-space: normal;
				margin: 10px 0;
			}
		}
	}
	.tip{
		background-color: #DDF3EC;
		width: 52px;
		line-height: 24px;
		border-radius: 6px;
		color: #0DC283;
		margin-left: 8px;
		text-align: center;
	}
</style>